// 淡入动画
@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

// 打字机效果动画
@keyframes typing {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-5px);
  }
}

// 脉冲动画（用于加载状态）
@keyframes pulse {
  0%, 100% {
    opacity: 1;
  }
  50% {
    opacity: 0.5;
  }
}

// 闪烁动画（用于连接状态）
@keyframes blink {
  0%, 100% {
    opacity: 1;
  }
  50% {
    opacity: 0.5;
  }
}

// 应用动画的混合
@mixin animation-fadeIn {
  animation: fadeIn 0.3s ease-in-out;
}

@mixin animation-typing {
  animation: typing 1s infinite ease-in-out;
}

@mixin animation-pulse {
  animation: pulse 2s infinite;
}

@mixin animation-blink {
  animation: blink 1.5s infinite;
}